<template>
  <a-button
    v-if="buttonShow"
    type="text"
    class="horizontal-btn"
    :class="{ 'current-btn': isCurrent }"
    :style="buttonStyle"
    @click="jumpWorkbench"
  >
    流程配置
  </a-button>
</template>

<script setup lang="ts">
  import { useRoute, useRouter } from 'vue-router'
  import { defineProps, computed } from 'vue'
  import { useUserStoreWithOut } from '@/store/modules/user'

  const userStore = useUserStoreWithOut()
  const permissionCodeMap = userStore.getPermissionMap

  const props = defineProps<{
    buttonStyle: any
  }>()

  const WORKFLOW_PATH = '/allin-app/allin-workflow-web/workflow'
  const route = useRoute()
  const router = useRouter()
  const workbenchRoute = router.resolve({
    path: `/:productCode/:tenantCode${import.meta.env.VITE_PUBLIC_PATH}${WORKFLOW_PATH}`
  })

  const buttonShow = computed(() => {
    return permissionCodeMap && permissionCodeMap.includes(workbenchRoute?.meta?.code)
  })

  const isCurrent = computed(() => {
    return route.path.endsWith(WORKFLOW_PATH)
  })

  function jumpWorkbench() {
    if (isCurrent.value) {
      return
    }
    const { productCode, tenantCode } = route.params || {}
    router.push(
      `/${productCode}/${tenantCode}${import.meta.env.VITE_PUBLIC_PATH}/allin-app/allin-workflow-web/workflow`
    )
  }
</script>
<style lang="less" scoped>
  .current-btn {
    color: #1890ff !important;
  }
</style>
